<template>
    <div class="box">
        <div class="header_box">
            <HeaderView>
                <template v-slot:center>
                   <div class="header_box_main">
                     团购套餐
                   </div>  
                </template>
                <template v-slot:right>
                   <div @click="toCeateGroupBuy">
                     确定
                   </div>  
                </template>
            </HeaderView>
        </div>

        <div>
            <van-form>
                <van-field
                    v-model="chineseTag"
                    name="中文标签"
                    label="中文标签"
                    placeholder="如主菜"
                    :rules="[{ required: true, message: '请填写中文标签' }]"
                />
                <van-field
                    v-model="engTag"
                    name="英文标签"
                    label="英文标签"
                    placeholder="Such as Main course"
                    :rules="[{ required: true, message: '请填写英文标签' }]"
                />
                <van-field
                    v-model="goodDetail"
                    name="商品明细"
                    label="商品明细"
                    placeholder="添加商品>>"
                    :rules="[{ required: true, message: '请填写商品明细' }]"
                    @click="toAddGoodDetail"
                />
                <van-field
                    v-model="goodPrice"
                    name="商品价值"
                    label="商品价值"
                    placeholder="如900"
                    :rules="[{ required: true, message: '请填写商品价值' }]"
                />
            </van-form>
        </div>
    </div>
</template>
<script>
export default{
    data(){
        return{
            chineseTag:'',
            engTag:'',
            goodDetail:{},
            goodPrice:'',

            packageObj:{   // 套餐内容
                chineseLabel:this.chineseTag,
                englishLabel:this.engTag,
                goodDetail:this.goodDetail,  //第二层对象
                goodsPrice:this.goodPrice
            }

        }
    },
    created(){
        this.goodDetail=this.$route.query.goodsDetail
    },
    methods:{
        toCeateGroupBuy(){
            this.$router.push({
                path:'./CeateGroupBuy',
                query:{
                    groupBuyCombo:this.packageObj
                }
            })
        }
    }
}
</script>
<style scoped>
    .header_box_main{
        background: #ff6e53;
        width: 100px;
        text-align: center;
        margin:0 auto;
    }
    .box{
        background: #f5f5f5;
    }



</style>
<script>
    import HeaderView from '@/components/header1View.vue';
    export default{
        data(){
            return{
                chineseTag:'',
                engTag:'',
                goodDetail:'',
                goodPrice:''
            }
        },
        methods:{
            toAddGoodDetail(){
                this.$router.push('./AddGoodDetail')
            }
        },
        components:{
            HeaderView
        }
    }
</script>